<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="UTF-8"/>
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

    <title>轮播图管理</title>

    <link href="../plugin/bootstrap-3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
    <link href="../plugin/bootstrap-table-1.11.1/bootstrap-table.min.css" rel="stylesheet"/>
    <link href="../plugin/sweetalert-6.6.2/sweetalert2.min.css" rel="stylesheet"/>
    <link href="../plugin/bootstrap-3.3.7/plugin/file_input/fileinput.min.css" rel="stylesheet"/>
    <link href="../plugin/bootstrap-3.3.7/plugin/datatimepicker/bootstrap-datetimepicker.min.css" rel="stylesheet"/>
    <link href="../plugin/jquery-zoomify/zoomify.min.css" rel="stylesheet"/>

    <script src="../plugin/jquery-3.2.1/jquery-3.2.1.min.js"></script>
    <script src="../plugin/bootstrap-3.3.7/js/bootstrap.min.js"></script>
    <script src="../plugin/bootstrap-3.3.7/plugin/file_input/fileinput.min.js"></script>
    <script src="../plugin/bootstrap-3.3.7/plugin/file_input/local_zh.js"></script>
    <script src="../plugin/bootstrap-3.3.7/plugin/datatimepicker/bootstrap-datetimepicker.min.js"></script>
    <script src="../plugin/bootstrap-3.3.7/plugin/datatimepicker/bootstrap-datetimepicker.zh-CN.js"></script>
    <script src="../plugin/bootstrap-table-1.11.1/bootstrap-table.min.js"></script>
    <script src="../plugin/bootstrap-table-1.11.1/locale/bootstrap-table-zh-CN.min.js"></script>
    <script src="../plugin/sweetalert-6.6.2/sweetalert2.min.js"></script>
    <script src="../plugin/jquery-3.2.1/jquery.formautofill.min.js"></script>
    <script src="../plugin/jquery-3.2.1/jquery.serializejson.js"></script>
    <script src="../plugin/wangEditor-3.0.15/wangEditor.min.js"></script>
    <script src="../plugin/jquery-zoomify/zoomify.min.js"></script>
    <script src="../plugin/soul/utils3.js"></script>
    <script src='../base/base.js'></script>

</head>

<body>
</body>
<script>
    $(function () {
        var resp = AjaxUtil.isLogin();
        if (!resp) return;
        var module = 'slideshow';
        var query = [];
        var toolbar = {
            default: [false, true, true, true],// back;add;edit;remove
            dialog: [60, 2, 9],//对话框参数:模态框宽度(百分比);表单标题宽度;表单输入框宽度
            extra: [
                {
                    name: '激活/不激活',
                    glyphicon: 'chinese',
                    onclick: 'changeStatus',
                }
            ]
        };
        var formElement = [{
            action: [false, true],
            type: 'hidden',
            name: 'slideshowId',
        }, {
            action: [true, true],
            type: 'text',
            label: '中文标题',
            name: 'chineseTitle',
        }, {
            action: [true, true],
            type: 'text',
            label: '英文标题',
            name: 'englishTitle',
        }, {
            action: [true, true],
            type: 'text',
            label: '中文简介',
            name: 'chineseExplain',
        }, {
            action: [true, true],
            type: 'text',
            label: '英文简介',
            name: 'englishExplain',
        }, {
            action: [true, true],
            id: 'chineseBigMap',
            type: 'images',
            label: '大分辨率图片(中文)',
            name: 'chineseBigMap',
            module: 'chineseBigMap',
            maxCount: 1
        },{
            action: [true, true],
            id: 'chineseSmallMap',
            type: 'images',
            label: '小分辨率图片(中文)',
            name: 'chineseSmallMap',
            module: 'chineseSmallMap',
            maxCount: 1
        },{
            action: [true, true],
            id: 'englishBigMap',
            type: 'images',
            label: '大分辨率图片(英文)',
            name: 'englishBigMap',
            module: 'englishBigMap',
            maxCount: 1
        }, {
            action: [true, true],
            id: 'englishSmallMap',
            type: 'images',
            label: '小分辨率图片(英文)',
            name: 'englishSmallMap',
            module: 'englishSmallMap',
            maxCount: 1
        },{
            action: [true, true],
            type: 'radio',
            label: '跳转方式',
            name: 'jump',
            items: [{
                name: '不跳转',
                value: -1
            },{
                name: '内链',
                value: 1
            },{
                name: '外链',
                value: 2
            }]
        }, {
            action: [true, true],
            type: 'number',
            label: '排序值（越大等级越高）',
            name: 'mapOrder',
        },{
            action: [true, true],
            type: 'text',
            label: '英文内链URL',
            name: 'englishInteriorLink',
        }, {
            action: [true, true],
            type: 'text',
            label: '中文内链URL',
            name: 'chineseInteriorLink',
        }, {
            action: [true, true],
            type: 'text',
            label: '英文外链URL（需加https：//）',
            name: 'englishExternalLink',
        }, {
            action: [true, true],
            type: 'text',
            label: '中文外链URL（需加https：//）',
            name: 'chineseExternalLink',
        }];
        var bootstrapTable = {
            columns: [{
                radio: true
            }, {
                field: 'slideshowId',
                title: '轮播图编号',
                align: 'center',
            }, {
                field: 'chineseTitle',
                title: '中文标题',
                align: 'center',
            }, {
                field: 'englishTitle',
                title: '英文标题',
                align: 'center',
            },  {
                field: 'chineseBigMap',
                title: '大分辨率图片（中文）',
                formatter: function (value, row, index) {
                    return BootstrapTableUtil.formatter.image(value, 'chineseBigMap', '60')
                },
            },  {
                field: 'chineseSmallMap',
                title: '小分辨率图片（中文）',
                formatter: function (value, row, index) {
                    return BootstrapTableUtil.formatter.image(value, 'chineseSmallMap', '60')
                },
            },  {
                field: 'englishBigMap',
                title: '大分辨率图片（英文）',
                formatter: function (value, row, index) {
                    return BootstrapTableUtil.formatter.image(value, 'englishBigMap', '60')
                },
            },  {
                field: 'englishSmallMap',
                title: '小分辨率图片（英文）',
                formatter: function (value, row, index) {
                    return BootstrapTableUtil.formatter.image(value, 'englishSmallMap', '60')
                },
            }, {
                field: 'mapOrder',
                title: '排序值',
                align: 'center',
            }, {
                field: 'jump',
                title: '跳转方式',
                align: 'center',
                formatter: function (value, row, index) {
                    if (value == -1) {
                        return '不跳转';
                    } else if (value == 1) {
                        return '内链';
                    } else if (value == 2) {
                        return '外链';
                    }
                }
            }, {
                field: 'englishInteriorLink',
                title: '英文内链URL',
                align: 'center',
            },{
                field: 'chineseInteriorLink',
                title: '中文内链URL',
                align: 'center',
            }, {
                field: 'englishExternalLink',
                title: '英文外链URL',
                align: 'center',
            },{
                field: 'chineseExternalLink',
                title: '中文外链URL',
                align: 'center',
            },{
                field: 'status',
                title: '轮播图状态',
                align: 'center',
                formatter: function (value, row, index) {
                    if(value == 1){
                        return "激活";
                    }
                    else if(value == 2){
                        return "不激活";
                    }
                },
            }]
        };
        slideshow = SingleTablePageCreateUtil.createInstance(module, null, toolbar, formElement, bootstrapTable);
        slideshow.onEditModalShowBefore = function (row) {
            FileinputUtil.initPreview("#slideshow_form_edit_chineseBigMap", "chineseBigMap", row.chineseBigMap);
            FileinputUtil.initPreview("#slideshow_form_edit_chineseSmallMap", "chineseSmallMap", row.chineseSmallMap);
            FileinputUtil.initPreview("#slideshow_form_edit_englishBigMap", "englishBigMap", row.englishBigMap);
            FileinputUtil.initPreview("#slideshow_form_edit_englishSmallMap", "englishSmallMap", row.englishSmallMap);
            redioChange(row.jump)
            return row;
        };
        /*删除键处理*/
        slideshow.onRemoveSubmitBefore = function (row) {
            row.updateTime = new Date();
            row.createTime = new Date();
            return row;
        };
        /*激活/不激活*/
        slideshow.changeStatus = function () {
            var row = TablePageCreatePublicUtil.getRowFromTable('#slideshow_table');
            if (!row) return false;
            console.log(row)
            row.updateTime = new Date();
            row.createTime = new Date();
            var resp = AjaxUtil.postJson("slideshow/changeStatus",row);
            if (resp) {
                SwalUtil.success(resp.msg);
                $('#slideshow_table').bootstrapTable('refresh');
            }
        };










        /*跳转方式发生改变时，对应状态发生改变*/
        var radio = $('input[name="jump"]');
        radio.change(function () {
            var isclient = $(this).val();
            redioChange(isclient);

        });
        function redioChange(isclient) {
            var inputObj = $('#slideshow_modal_add input[name="englishInteriorLink"]');
            var inputObj2 = $('#slideshow_modal_add input[name="chineseInteriorLink"]');
            var inputOjb3 = $('#slideshow_modal_add input[name="englishExternalLink"]');
            var inputOjb4 = $('#slideshow_modal_add input[name="chineseExternalLink"]');
            var inputRequireFee = $('#slideshow_modal_add input[name="jump"]');
            var inputObj5 = $('#slideshow_modal_edit input[name="englishInteriorLink"]');
            var inputObj6 = $('#slideshow_modal_edit input[name="chineseInteriorLink"]');
            var inputObj7 = $('#slideshow_modal_edit input[name="englishExternalLink"]');
            var inputObj8 = $('#slideshow_modal_edit input[name="chineseExternalLink"]');
            var inputRequireFee2 = $('#slideshow_modal_edit input[name="jump"]');
            if (isclient == "-1") {
                console.log(isclient)
                inputObj.attr('disabled', 'true');
                inputObj.val("");
                inputObj2.attr('disabled', 'true');
                inputObj2.val("");
                inputOjb3.attr('disabled', 'true');
                inputOjb3.val("");
                inputOjb4.attr('disabled', 'true');
                inputOjb4.val("");
                inputObj5.attr('disabled', 'true');
                inputObj5.val("");
                inputObj6.attr('disabled', 'true');
                inputObj6.val("");
                inputObj7.attr('disabled', 'true');
                inputObj7.val("");
                inputObj8.attr('disabled', 'true');
                inputObj8.val("");
                inputRequireFee.val();
                inputRequireFee2.val();
            } else if(isclient == "1" ) {
                inputObj.attr('disabled', false);
                inputObj2.attr('disabled', false);
                inputOjb3.attr('disabled', 'true');
                inputOjb3.val("");
                inputOjb4.attr('disabled', 'true');
                inputOjb4.val("");
                inputObj5.attr('disabled', false);
                inputObj6.attr('disabled', false);
                inputObj7.attr('disabled', 'true');
                inputObj7.val("");
                inputObj8.attr('disabled', 'true');
                inputObj8.val("");
            } else if(isclient == "2") {
                inputObj.attr('disabled', 'true');
                inputObj.val("");
                inputObj2.attr('disabled', 'true');
                inputObj2.val("");
                inputOjb3.attr('disabled', false);
                inputOjb4.attr('disabled', false);
                inputObj5.attr('disabled', 'true');
                inputObj5.val("");
                inputObj6.attr('disabled', 'true');
                inputObj6.val("");
                inputObj7.attr('disabled', false);
                inputObj8.attr('disabled', false);
            }

        }

    });
</script>
</html>